<template>
  <div>
    <ul class="mui-table-view">
      <li class="mui-table-view-cell mui-media" v-for="item in newslist" :key="item.id">
        <router-link :to="'/home/newsinfo/' + item.id">
          <img class="mui-media-object mui-pull-left" :src="item.img_url">
          <div class="mui-media-body">
          <h1>{{ item.title }}</h1>
            <p class='mui-ellipsis'>
              <span>发表时间：{{ item.add_time | dateFormat }}</span>
              <span>点击：{{ item.click }}次</span>
            </p>
            </div>
          </router-link>
      </li>
     
		</ul>
  </div>
</template>

<script>
  import { Toast } from 'mint-ui';
  export default {
    data(){
      return {
        newslist: []
      }
    },
    created(){
      this.getNewsList();
    },
    methods:{
      getNewsList(){ 
        /* 获取新闻列表 
        this.$http.get('api/getnewslist')
        .then(result=>{
          if(result.body.status === 0){
            // 如果没有失败，把数据保存到data上
            this.newslist = result.body.message;
          }else{
            Toast('获取新闻列表失败！')
          }
        })
        .catch(function(err){
          Toast('请求服务器失败！' + err.message);
        }) */
        // 模拟数据
        var obj1 = {
          "id": 11,
          "title" : "1多阶级企业润例，存放弄打响",
          "add_time": "2018-03-04T10:20:20.000Z",
          "zhaiyao":"摘要内容：房咯的额懒得弄额各类哦的哦",
          "click":1,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }
         var obj2 = {
          "id": 12,
          "title" : "廉洁奉公存放弄打响阶级企业润例，",
          "add_time": "2018-04-04T10:20:20.000Z",
          "zhaiyao":"摘要内容：奉公存放弄打响阶级企哦的哦",
          "click":3,
          "img_url": "http://www.qqzhi.com/uploadpic/2014-10-01/203445107.jpg"
          
        }
         var obj3 = {
          "id": 13,
          "title" : "发明了光荣级企业润例的呢哦，带来过么哦",
          "add_time": "2018-05-04T10:20:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":6,
          "img_url": "http://www.qqzhi.com/uploadpic/2014-10-01/203449808.jpg"
        }
        var obj4 = {
          "id": 14,
          "title" : "发明了光荣级企业润例的呢哦，带来过么哦",
          "add_time": "2018-01-04T10:20:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":6,
          "img_url": "http://www.qqzhi.com/uploadpic/2014-10-01/203458290.jpg"
        }
        var obj5 = {
          "id": 15,
          "title" : "天麻片小龙女狗儿企业润例的呢哦，带来过么哦",
          "add_time": "2018-01-04T10:21:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":8,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }
        var obj6 = {
          "id": 16,
          "title" : "入门篇发布美容业润例的呢哦，带来过么哦",
          "add_time": "2018-01-03T10:20:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":2,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }
        var obj7 = {
          "id": 17,
          "title" : "两个风格融入荣级企业润例的呢哦，带来过么哦",
          "add_time": "2018-02-03T11:20:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":2,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }
        var obj8 = {
          "id": 18,
          "title" : "佛光进入荣级企业润例的呢哦，带来过么哦",
          "add_time": "2018-02-13T11:20:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":2,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }
        var obj9 = {
          "id": 19,
          "title" : "法官能够让发明了光荣级企业润例的呢哦，带来过么哦",
          "add_time": "2018-05-13T11:10:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":22,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }
         var obj10 = {
          "id": 20,
          "title" : "地花费打开恁都弄级企业润例的呢哦，带来过么哦",
          "add_time": "2018-03-16T11:30:20.000Z",
          "zhaiyao":"摘要内容：企业润例的呢哦，带来过么的哦",
          "click":20,
          "img_url": "http://img.25pp.com/uploadfile/soft/images/2014/0902/20140902021146469.jpg"
        }

        this.newslist.push(obj1)
        this.newslist.push(obj2)
        this.newslist.push(obj3)
        this.newslist.push(obj4)
        this.newslist.push(obj5)
        this.newslist.push(obj6)
        this.newslist.push(obj7)
        this.newslist.push(obj8)
        this.newslist.push(obj9)
        this.newslist.push(obj10)



      }
    }
  }
</script>

<style lang="scss" scoped>
.mui-table-view{
 li{
   h1{
    font-size: 14px;
   }
   .mui-ellipsis{
     font-size: 12px;
     color:#226aff;
     display: flex;
     justify-content: space-between;
   }
 }
}
</style>
